// 将给定对象包装为·Proxy·实现数据相应
function reactive (obj) {
  const functions = {};
  
  return new Proxy(obj, {
    get (target, property) {
      if (!functions[property]) {
        functions[property] = watch.effect;
      }
      return target[property];
    },
    set (target, property, value) {
      target[property] = value;
      functions[property]();
    }
  })
}

// 添加一个数据状态监视函数
function watch (effect) {
  watch.effect = effect;
  effect();
}

const state = reactive({
  foo: 100,
  bar: 200,
})

watch(() => {
  console.log('foo changed: ', state.foo);
});

watch(() => {
  console.log('bar changed: ', state.bar);
});
console.log('======================');
state.bar++;
state.foo++;

state.foo = 200;